<script setup>
import { ref } from 'vue'
import { postWxLogin } from '@/apis/apis.js'
import { showToast } from '@/utils/utils.js'
const nickName = ref('')
const avatarUrl = ref('')
const code = ref('')
const handleLogin = async () => {
  try {
    let res = await uni.getUserProfile({
      lang: 'zh_CN',
      desc: '获取个人信息',
    })
    nickName.value = res.userInfo.nickName
    avatarUrl.value = res.userInfo.avatarUrl
    
    res = await uni.login()
    code.value = res.code

    res = await postWxLogin({
      appid: '',
      secret: '',
      nickName: nickName.value,
      avatarUrl: avatarUrl.value,
      code: code.value
    })
    uni.setStorageSync('token', res.data.user_Token)
    uni.setStorageSync('user', {
      nickName: res.data.nickName,
      avatarUrl: res.data.avatarUrl
    })
    showToast('登录成功')
    setTimeout(() => {
      uni.navigateBack()
    }, 1000);
  }
  catch (err) {
    showToast('网络连接异常')
  }
}
</script>

<template>
  <view class="view">
    <image class="view-image" src="/static/images/denglu-yemian.jpg" mode="aspectFill"></image>
    <button class="view-button" @click="handleLogin">授权登录</button>
  </view>
</template>

<style scoped lang="scss">
.view {
  position: relative;
  display: flex;
  justify-content: center;
  align-items: center;
  height: 100vh;
  .view-image {
    position: absolute;
    top: 0;
    left: 0;
    width: 750rpx;
    height: 100vh;
  }
  .view-button {
    margin-top: 500rpx;
    width: 300rpx;
    background-color: #4176e1;
    color: #fff;
  }
}
</style>
